@import "compass/reset";
@import "../font/iconfont";
$fontSize:46.875;
$headerBg:#1d1c21;
$bg:#f0eff4;
$borderColor:#ccc;
$labelColor:#ff3b32;
$primaryColor:#18ac18;

*{font-family: 'Microsoft Yahei',Arial, Helvetica, sans-serif;}


@function rem($n) {
    @return $n/$fontSize*1rem;
}

a{
    text-decoration: none;
}


.page-view {
    position: relative;
    width: 100%;
    padding-top:rem(88);
    overflow: hidden;

    
}
.header {
    position: fixed;
    top:0;
    height: rem(88);
    z-index:999;
    width: 100%;
    background-color: $headerBg;
    color: #fff;
    text-align: center;
    font-size:rem(36);
    line-height: rem(88);
    h3{
        font-weight: bold;
    }
    a{
        position: absolute;
        top:0;
        height:rem(88);
        color:#fff;
        font-size:rem(36);
    
        
    }
    .header-btn-left{
        left:rem(20);
        transform: rotate(-180deg);
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);

    }
    .header-btn-right{
        right:rem(20);
    }
}

/*tapbar实现方法一*/
/*rgb(32, 31, 31)
.tapBar{
    position: fixed;
    bottom:0;
    left:0;
    z-index:999;
    width:100%;
    overflow: hidden;
    height: rem(85);
    border-top:1px solid $borderColor;
    background: #fff;
    padding-top:rem(15);
    a{
        float:left;
        width:25%;
        text-align: center;
        text-decoration: none;
        font-size:rem(20);
        color:#808080;
        i{
            font-size:rem(45);
            display: block;
            margin:0 auto rem(14);

        }
    }
    &:after{
        display: block;
        clear: both;
        height:0;
    }
}*/
.tapBar {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    overflow: hidden;
    height: rem(85);
    border-top: 1px solid $borderColor;
    background: #fff;
    padding-top: rem(15);
    display: flex;
    display: -webkit-flex;

    a {
        width: 50%;
        text-align: center;
        text-decoration: none;
        font-size: rem(20);
        color: #808080;

        i {
            font-size: rem(45);
            display: block;
            margin: 0 auto rem(14);

        }
    }

    a.active {
        color: $primaryColor;

        .icon-weixintubiao-7:before {
            content: "\e603";
        }
        .icon-weixintubiao-8:before {
            content: "\e6c2";
        }
        .icon-weixintubiao-6:before {
            content: "\e606";
        }
      
    }
}